<template>
  <div class="app-container">
    <el-form label-width="100px">
      <h3>患者信息</h3>
      <el-col :span="6">
        <el-form-item label="病例号">
          <el-input type="text" v-model="patientBean.patient.pid"></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="18">
        <el-form-item>
          <el-button type="primary" @click="getPatientCharge"
            >查询患者费用</el-button
          >
           <el-button type="primary" @click="resetForm"
                  >重置</el-button
                >
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="患者姓名">
          <el-input v-model="patientBean.patient.pname" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="患者年龄">
          <el-input v-model="patientBean.patient.age" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="看诊科室">
          <el-input v-model="patientBean.dept.deptname" disabled></el-input>
        </el-form-item>
      </el-col>
      <el-col :span="6">
        <el-form-item label="看诊医生">
          <el-input v-model="patientBean.doctor.dname" disabled></el-input>
        </el-form-item>
      </el-col>
      <h3>检验项目</h3>
      <el-container style="padding-left: 25px">
        <el-table
          ref="inspectiteMrecordTable"
          :data="patientBean.inspectiteMrecords"
          style="width: 100%"
          :row-class-name="tableRowClassName"
        >
          <el-table-column type="selection" width="55"></el-table-column>

          <el-table-column label="id" width="120">
            <template slot-scope="scope">{{ scope.row.id }}</template>
          </el-table-column>
          <el-table-column prop="inspectitem.inspectname" label="检验名称">
          </el-table-column>
          <el-table-column prop="inspectitem.price" label="检验价格">
          </el-table-column>

          <el-table-column label="数量" prop="amount"> </el-table-column>
          <el-table-column label="状态">
            <template slot-scope="scope">{{
              scope.row.paystatus | paystatusFilter
            }}</template>
          </el-table-column>
        </el-table>
      </el-container>
      <h4>总价:{{ totalPrice | showPrice }}</h4>
      <h4>收费价格:{{ chargePrice | showPrice }}</h4>
       <h3>检查项目</h3>
      <el-container style="padding-left: 25px">
        <el-table
          ref="checkiteMrecordTable"
          :data="patientBean.checkiteMrecords"
          style="width: 100%"
          :row-class-name="tableRowClassName"
        >
          <el-table-column type="selection" width="55"></el-table-column>

          <el-table-column label="id" width="120">
            <template slot-scope="scope">{{ scope.row.id }}</template>
          </el-table-column>
          <el-table-column prop="checkitem.itemname" label="检验名称">
          </el-table-column>
          <el-table-column prop="checkitem.price" label="检验价格">
          </el-table-column>

          <el-table-column label="数量" prop="amount"> </el-table-column>
          <el-table-column label="状态">
            <template slot-scope="scope">{{
              scope.row.paystatus | paystatusFilter
            }}</template>
          </el-table-column>
        </el-table>
      </el-container>
      <h4>总价:{{ totalPrice2 | showPrice }}</h4>
      <h4>收费价格:{{ chargePrice2 | showPrice }}</h4>
      <el-col :span="6">
       <el-form-item>
        <el-button type="primary" @click="submitCharge">检验项目收费</el-button>
      </el-form-item>
      </el-col>
      <el-col :span="6">
      <el-form-item>
        <el-button type="primary" @click="submitCharge2">检查项目收费</el-button>
      </el-form-item>
      </el-col>
    </el-form>
  </div>
</template>

<script>
import patient from "@/api/patient";
import medicalrecordapi from "@/api/medicalrecordapi";
export default {
  name: "Charge",
  data() {
    return {
      patientBean: {
        patient: {
          pid: "",
          pname: "",
          age: "",
        },
        dept: {
          dpetname: "",
        },
        doctor: {
          dname: "",
        },
        inspectiteMrecords: [],
         checkiteMrecords: [],
      },
    };
  },
  methods: {
    //收费病例号查询重置
    resetForm() {
      //this.patientBean.patient.pid="";
      this.patientBean.patient={};
      this.patientBean.dept={};
      this.patientBean.doctor={};
      this.patientBean.inspectiteMrecords=[];
      this.patientBean.checkiteMrecords=[];
    },
    
    getPatientCharge() {
      if (this.patientBean.patient.pid == "") {
        this.$notify.error({
          title: "错误",
          message: "请输入患者病例号",
        });
      } else {
         patient
           .getPatientBeanByPatientId(this.patientBean.patient.pid)
           .then((res) => {
             this.patientBean = res.data.patientBean;
             // console.log(this.patientBean.patient.pname);
           });
      }
    },
    selectionPayStatus(row) {
      if (row.paystatus == 0) {
        return true;
      } else {
        return false;
      }
    },
    tableRowClassName({ row, rowIndex }) {
      if (row.paystatus == 1) {
        return "warning-row";
      }
      return "";
    },
    submitCharge() {
         let arr = new Array();
         this.$refs.inspectiteMrecordTable.selection.forEach((item) => {
           arr.push(item.id);
         });
         let imids = arr.join(",");
         medicalrecordapi.updateIMrecordById(imids).then((res) => {
           this.getPatientCharge();
         });
    },
    submitCharge2() {
         let arr = new Array();
         this.$refs.checkiteMrecordTable.selection.forEach((item) => {
           arr.push(item.id);
         });
         let imids = arr.join(",");
         medicalrecordapi.updateIMrecordById2(imids).then((res) => {
           this.getPatientCharge();
         });
    },
  },
  filters: {
    showPrice(value) {
      return "$" + value.toFixed(2);
    },
    paystatusFilter(value) {
      if (value == 0) {
        return "未缴费";
      } else {
        return "已缴费";
      }
    },
  },
  computed: {
    totalPrice() {
      let total = 0;
      this.patientBean.inspectiteMrecords.forEach((item) => {
        total += item.inspectitem.price * item.amount;
      });
      return total;
    },
    totalPrice2() {
      let total = 0;
      this.patientBean.checkiteMrecords.forEach((item) => {
        total += item.checkitem.price * item.amount;
      });
      return total;
    },
    chargePrice() {
      let total = 0;
      
        if (this.patientBean.inspectiteMrecords.length > 0) {
           this.$refs.inspectiteMrecordTable.selection.forEach((item) => {
             total += item.amount * item.inspectitem.price;
           });
         }
      return total;
    },
     chargePrice2() {
      let total = 0;
      
        if (this.patientBean.checkiteMrecords.length > 0) {
           this.$refs.checkiteMrecordTable.selection.forEach((item) => {
             total += item.amount * item.checkitem.price;
           });
         }
      return total;
    },
  },
};
</script>
<style lang="scss">
.el-table .warning-row {
  background: rgb(247, 152, 231);
}
</style>
